<!DOCTYPE html>
<html>
<head>
	<title>页面试做</title>
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
	<link rel="stylesheet" type="text/css" href="css/FristPage.css">
</head>
<body>
	<!-- 导航 -->
	<div class="side-nav" role="navigation">
		<ul class="nav-side-nav">
			<li><a href="#onepage" class="tooltip-side-nav"></a></li>
			<li><a href="#twopage" class="tooltip-side-nav"></a></li>
			<li><a href="#threepage" class="tooltip-side-nav"></a></li>
			<li><a href="#fourpage" class="tooltip-side-nav"></a></li>
			<li><a href="#five" class="tooltip-side-nav"></a></li>
		</ul>
	</div>

	<div class="onepage" id="onepage">
		<div class="onepage-bg" id="onepagebg"></div>
		<div class="container">
			<div class="row">
				<div class="title-text">
					<div class="col-md-12 headfontsize">
						<h1 class="headh1content">
						Light Up The Sky<br>
						重拾自我
						</h1>
						<p style="margin-top: 50px;line-height: 33px">
							Love is always arround the world if you find<br>Love is always arround the world if you find
						</p>
						<p class="btn-app-stroe" >
							<a class="btn btn-success btn-lg" href="#">Join Us</a>
						</p>
					</div>			
				</div>
			</div>
		</div>
	</div>

	<div class="twopage" id="twopage">
		<div class="twopage-text">
			<h1 class="twopage-text-h1">
				选择第一节任务szdfxg
				<img src="images/01.jpg" style="width: 40px;height: 40px">
			</h1>
		</div>
		<div class="row">
			<div class="twopage-courses col-md-4">
				<a href="#">
					<img src="images/02.jpg" style="width: 100%">
					<div class="classicon">
						<h3>认真完成哦</h3>
						<h1><strong>学习这个课程</strong></h1>
					</div>
				</a>
			</div>
			<div class="twopage-courses col-md-4">
				<a href="#">
					<img src="images/03.jpg" style="width: 100%">
					<div class="classicon">
						<h3>认真完成哦</h3>
						<h1><strong>学习这个课程</strong></h1>
					</div>
				</a>
			</div>
			<div class="twopage-courses col-md-4">
				<a href="#">
					<img src="images/04.jpg" style="width: 100%">
					<div class="classicon">
						<h3>认真完成哦</h3>
						<h1><strong>学习这个课程</strong></h1>
					</div>
				</a>
			</div>
		</div>	
		<div class="twopagebtn">
			<a id="twopage-easy" href="#" class="btn btn-success btn-lg">如果你想......，快点我吧!!!</a>
		</div>
	</div>

	<div class="threepage" id="threepage">
		<div class="threepage-bg" id="threepagebg">
			<div class="threepagecontent">
			<div class="threepagetext">
				<h1>进度进度进度</h1>
				<p>如果你想......，快点我吧!!!如果你想......，快点我吧!!!如果你想......，快点我吧!!!<br>如果你想......，快点我吧!!!如果你想......，快点我吧!!!</p>
			</div>
			<a href="#" class="btn btn-success btn-lg threepagebtncontent">快速进行，要晚啦！！</a>
		</div>
		</div>
	</div>

<!-- 轮播图 -->
	<div class="fourpage" id="fourpage">
		<div class="container" style="width: 70%">
			<div class="coursexingqing-text">
				<h1>来干活啦！</h1>
				<p>怎样才能做到最有效呢？</p>
			</div>
			<!-- data-interval：5秒滑动一次 -->
			<div id="carousel-example-generic" class="carousel slide" data-interval="3000" style="height: 300px">
				<ol class="carousel-indicators" style="margin-top: 200px">
					<li data-target="#carousel-example-generic" data-slide="0" class="active"></li>
					<li data-target="#carousel-example-generic" data-slide="1" class=""></li>
					<li data-target="#carousel-example-generic" data-slide="2" class=""></li>
				</ol>
				<div class="carousel-inner">
					<div class="item active" style="width: 500px;">
						<img src="images/06.jpg">
					</div>
					<div class="item" style="width: 500px;">
						<img src="images/07.jpg">
					</div>
					<div class="item" style="width: 500px;">
						<img src="images/08.jpg">
					</div>
				</div>
				<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
					<span class="glyphicon glyphicon-chevron-left"></span>
				</a>
				<a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
					<span class="glyphicon glyphicon-chevron-right"></span>
				</a>
			</div>
		</div>
	</div>

	<div class="fivepage" id="five">
		<div class="fivepage-bg" id="fivepage">
			<div class="container">
				<div class="footertext">
					<h1>你咋还在这呢</h1>
				</div>
				<div class="footerbtncenter">
					<div class="row">
						<a href="#">
							<div class="col-md-4">
								<img src="images/02.jpg" class="footerbtn quyueicon">
							</div>
						</a>
						<a href="#">
							<div class="col-md-4">
								<img src="images/02.jpg" class="footerbtn quyueicon">
							</div>
						</a>
						<a href="#">
							<div class="col-md-4">
								<img src="images/02.jpg" class="footerbtn quyueicon">
							</div>
						</a>
					</div>
					<div class="footertextbtn">
						<button type="button" class="btn btn-success btn-lg" style="font-size: 25px">
							你还在等什么么？？
						</button>
						<p class="footertextbtn-text">
							怎样才能做到最有效呢？怎样才能做到最有效呢？怎样才能做到最有效呢？怎样才能做到最有效呢？
						</p>
					</div>
				</div>
			</div>
		</div>
	</div>

<script type="text/javascript" src="js/jquery-3.0.0.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>

</body>
</html>